<script setup>
import { NEW_FILE, OPEN_FILE, SAVE_FILE, OPEN_FOLDER } from '@msg/file.js'
import { ref, onMounted } from 'vue'
import { QuillEditor } from '@vueup/vue-quill'
import '@vueup/vue-quill/dist/vue-quill.bubble.css'

const fileContent = ref('')
let filePath
const { ipcRenderer } = window.electron

onMounted(() => {
  ipcRenderer.on(`${OPEN_FILE}-render`, (e, data, path) => {
    fileContent.value = data
    console.log('fileContent.value', fileContent.value)
    filePath = path
  })

  ipcRenderer.on(`${SAVE_FILE}-render`, (e, flag) => {
    if (!flag) return
    alert('保存成功')
  })
})

const onSave = (e) => {
  if (e.ctrlKey && e.keyCode == 83 && filePath) {
    e.preventDefault()
    ipcRenderer.send(SAVE_FILE, fileContent.value, filePath)
  }
}
</script>

<template>
  <QuillEditor
    theme="bubble"
    @keydown="onSave"
    v-model:content="fileContent"
    contentType="text"
    @textChange="onTextChange"
  />
</template>

<style lang="scss" scoped>
:deep(.v-input__control),
:deep(.v-field__input) {
  height: 100%;
}
</style>
